<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增心理测试')" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-psychologicaRecord-add" th:object="${psychologicalTest}">
            <input type="hidden" th:name="testId" th:value="*{id}">
            <div class="form-group">
                <div class="col-sm-12 m-auto">
                    <h3>姓名:[[${#strings.defaultString(user.userName, '-')}]]</h3>
                </div>
            </div>
            <div class="form-group">    
                <div class="col-sm-12 m-auto">
                   <h3>[[*{name}]]</h3>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-12">
                    <div th:utext="*{description}">
                    </div>
                </div>
            </div>


            <div th:each="entries:${itemList}" class="form-group col-md-offset-4">

                <p class=" m-l m-r-xs">
                    [[${entries['sortNo']}]]. [[${entries['title']}]]
                </p>
                <div class="col-sm-10 checkbox m-l m-r-xs" th:each="answer:${entries['answerArray']}">
                    <div class="radio">
                        <label>
                            <input required type="radio" data-th-item-id = "${entries['id']}" class="answerRadio" th:value="${answer['score']}"  th:name="'an_' +${entries['id']}">[[${answer['content']}]]
                        </label>
                    </div>
                </div>
            </div>

            <div>
                <input type="hidden" id="score" name="score">
                <input type="hidden" id="answer" name="answer">
                <input type="hidden" name="testUserId" th:value="${(user.userId)}">
                <input type="hidden" name="testUserName" th:value="${(user.userName)}">
                <input type="hidden" name="testUserType" th:value="*{type}">
                <h3 class="text-success">评分: <strong id="total_score_p"></strong></h3>
            </div>

        </form>

        <div class="row">
            <div class="col-sm-offset-5 col-sm-10">
                <button type="button" class="btn btn-sm btn-primary" onclick="submitHandler()"><i class="fa fa-check"></i>提交</button>&nbsp;
            </div>
        </div>

    </div>
    <th:block th:include="include :: footer" />
    <script type="text/javascript">
        var prefix = ctx + "school/psychologicaRecord"
        $("#form-psychologicaTest-add").validate({
            focusCleanup: true
        });

        function submitHandler() {

            if ($.validate.form()) {
                var itemArray = [];
                $("input:radio:checked").each(function(i) {
                    var item = {};
                    var score = $(this).val();

                    var itemId = $(this).attr("item-id");

                    item["itemId"] = itemId;
                    item["score"] = score;
                    itemArray.push(item);

                });
                var data = JSON.stringify(itemArray);
                $("#answer").val(data);
                var res = $('#form-psychologicaRecord-add').serialize();

                $.operate.save(prefix + "/add", $('#form-psychologicaRecord-add').serialize());
            }
        }

        $(document).ready(function() {
            $('input[type=radio]').change(function() {

                var score = 0;

                $("input:radio:checked").each(function(i) {

                    var val = $(this).val();
                    score =parseInt(score)+parseInt(val);

                });

                $("#total_score_p").html(score);
                $("#score").val(score);

            });
        });
    </script>
</body>
</html>